<template>
  <div class="login-container">
    <h2>MySQL 数据</h2>
    <div v-if="mysqlData">
      <pre>{{ mysqlData }}</pre>
    </div>

    <h2>Redis 数据</h2>
    <div v-if="redisData">
      <pre>{{ redisData }}</pre>
    </div>
  </div>
</template>


<script>
import { getMysqlDemo, getRedisDemo } from '@/api/demo'

export default {
  data() {
    return {
      mysqlData: null,
      redisData: null
    }
  },
  created() {
    this.fetchMysqlData()
    this.fetchRedisData()
  },
  methods: {
    fetchMysqlData() {
      getMysqlDemo().then(response => {
        console.log(response)
        this.mysqlData = response
      }).catch(error => {
        console.error('获取 MySQL 数据失败:', error)
      })
    },
    fetchRedisData() {
      getRedisDemo().then(response => {
        console.log(response)
        this.redisData = response
      }).catch(error => {
        console.error('获取 Redis 数据失败:', error)
      })
    }
  }
}
</script>
